
let  { _drawRadiusRect} = require('./tool')
let drawText = require('./drawText')
 

//处理渐变
function dealGradients({ctx, x, y, width, height, gradients}) {
  if (typeof gradients === 'string') {
    let rwidth = width, rheight = height;
    let [startColor, endColor, direction] = gradients.match(/[\S]+/g) || [] 
    if (direction === '90') {
    }else  if (direction === '180') {
      rheight = 0
    } else {
      rwidth = 0
    }
    var lineargradient = ctx.createLinearGradient( x, y,x+rwidth,y+rheight);
    lineargradient.addColorStop(0,startColor);
    lineargradient.addColorStop(1, endColor);
 
    ctx.fillStyle = lineargradient
    ctx.fillRect(x, y,width,height);
  }
 
}


 function drawBlock({ options, data }) {
  dealGradients({ ...options, ...data })
  const { ctx ,pixelRatio} = options;
  const { text, width = 0, height, x, y, paddingLeft = 0, paddingRight = 0, borderWidth, backgroundColor, borderColor, borderRadius = 0, opacity = 1 } = data;
  // 判断是否块内有文字
  let blockWidth = 0; // 块的宽度
  let textX = 0;
  let textY = 0;
  if (typeof text !== 'undefined') {
    // 如果有文字并且块的宽度小于文字宽度，块的宽度为 文字的宽度 + 内边距
    // const textWidth = _getTextWidth(typeof text.text === 'string' ? text : text.text, drawOptions);
    const textWidth = _getTextWidth(text, options);
    blockWidth = textWidth > width ? textWidth : width;
    blockWidth += paddingLeft + paddingLeft;

    const {
      textAlign = 'left',
      // text: textCon,
    } = text;
    textY = height / 2 + y; // 文字的y轴坐标在块中线
    if (textAlign === 'left') {
      // 如果是右对齐，那x轴在块的最左边
      textX = x + paddingLeft;
    } else if (textAlign === 'center') {
      textX = blockWidth / 2 + x;
    } else {
      textX = x + blockWidth - paddingRight;
    }
  } else {
    blockWidth = width;
  }

  if (backgroundColor) {
    // 画面
    ctx.save();
    ctx.globalAlpha = opacity;
    ctx.fillStyle = backgroundColor;
    if (borderRadius > 0) {
      // 画圆角矩形
      let data = {
        x, y, w: blockWidth, h: height, r: borderRadius
      };
      _drawRadiusRect({data, options});
      ctx.fill();
    } else {
      ctx.fillRect(x, y, blockWidth, height);
    }
    ctx.restore();
  }
  if (borderWidth) {
    // 画线
    ctx.save();
    ctx.globalAlpha = opacity;
    if(borderColor){ ctx.strokeStyle = borderColor}
    ctx.lineWidth =  borderWidth
    if (borderRadius > 0) {
      // 画圆角矩形边框
      let data = {
        x, y, w: blockWidth, h: height, r: borderRadius,
      }
      _drawRadiusRect({data, options});
      ctx.stroke();
    } else {
      ctx.strokeRect(x, y,blockWidth, height);
    }
    ctx.restore();
  }

  if (text) {
    drawText({data:Object.assign(text, { x: textX, y: textY }), options})
  }
}

 



 function _getTextWidth(_text  , options)  {
  const { ctx } = options;
  let texts  = [];
  if (Array.isArray(_text)) {
    texts = _text;
  } else {
    texts.push(_text);
  }
  let width = 0;
  texts.forEach(({
    fontSize,
    text,
    marginLeft = 0,
    marginRight = 0
  }) => {
    ctx.fontSize= fontSize
    let _textWidth = 0;
    if (typeof text === 'object') {
      _textWidth = ctx.measureText(text.text).width + text.marginLeft + text.marginRight;
    } else {
      _textWidth = ctx.measureText(text).width;
    }
    width += _textWidth + marginLeft + marginRight;
  })
  return  width
}
module.exports = drawBlock
exports._getTextWidth =_getTextWidth